import React from 'react'
import { Form, Table, Icon, Tag, Modal, Steps, Button, message, Input, Row, Col, Select, DatePicker, InputNumber, Upload, Radio } from 'antd'
import { DropOption } from 'components'
import styles from './List.less'
import moment from 'moment'
import $ from "jquery"
import { CLIENT_RENEG_LIMIT } from 'tls';
import { openDev, sum, CaptureBase64 } from "../../sample/js/main"

const Step = Steps.Step;
const confirm = Modal.confirm
const FormItem = Form.Item;
const Option = Select.Option;
const RadioGroup = Radio.Group;
const { TextArea } = Input;

const steps = [{
	title: '填写档案基本信息',
	content: 'first',
}, {
	title: '上传资料',
	content: 'second',
}, {
	title: '完成',
	content: 'last',
}];
var ValueData = [];
const datas = [];
var uploadProps = [];
var billValue = '';
const dateFormat = 'YYYY/MM/DD HH:mm:ss';
const baseUrl = "http://file.sip.feelbang.com/files/"
const files1 = '';
var clickOne = ''
var pageDta = []
var threePageNumber = new Number()
var r = 0;

let uuid = 0;

class ModalSelect extends React.Component {
	constructor(props) {
		super(props);
		this.state = {
			current: 0,
			value: '',
			value1: '',
			bottons: '查看',
			previewVisible: false,
			previewImage: '',
			imgdatas: [],
			page1: '',
			page2: '',
			test: true,
			threePage: '',
			showImg: false,
			showScanImg: false,

			fileList1: [],
			fileList2: [],
			fileList3: [],
			fileList4: [],
			fileList5: [],

			imgList: [],
			showImgList: [],

			isChange: false,
			ischanges: false,

			createdTime: '',
			notarizationAt: '',
			documentType: '',

			showLoading: false,

			saveYear: "",

			keys:{},   //公证信息的内容
			keys1:{},  //申请人的内容
		};

		this.totalNumber = ''
	}
	next() {
		const { infoData, infoList } = this.props
		var data1 = [];
		//修改
		//		if (infoData) {
		//			data1 = JSON.parse(infoData.document.basicInfo)
		//		}
		//新增
		//		if (infoList) {
		//			data1 = JSON.parse(infoList.basicInfo)
		//		}
		//		if (location.search.split("?").length > 1) {
		//			if (ValueData != '') {
		//				for (var i = 0; i < ValueData.length; i++) {
		//					for (var j = 0; j < data1.length; j++) {
		//						if (ValueData[i].name == data1[j].name) {
		//							data1[j] = ValueData[i]
		//						}
		//					}
		//				}
		//				ValueData = data1
		//			} else {
		//				ValueData = data1
		//			}
		//		} e lse {
		//			for (var i = 0; i < ValueData.length; i++) {
		//				for (var j = 0; j < data1.length; j++) {
		//					if (ValueData[i].name == data1[j].name) {
		//						data1[j] = ValueData[i]
		//					}
		//				}
		//			}
		//			ValueData = data1
		//		}

		const { validateFields, getFieldsValue } = this.props.form
		const { info } = this.props
		
		validateFields((errors) => {
			if (errors) {
				return
			}
			const params = getFieldsValue()
			// console.log(params)

			params.notarizationAt = this.state.notarizationAt
			params.createdTime = this.state.createdTime
			const { depTypes } = this.props
			for (let i = 0; i < depTypes.length; i++) {
				if (params.dossierType == depTypes[i].id) {
					params.dossierType = depTypes[i].name
				}
			}
			let notarialMatters = ''
			let notaryNumber = ''
			let applyName = ''
			let idcard = ''
			for(let key in params){
				if(key.indexOf('notarialMatters')>=0){
					notarialMatters +=params[key]+ '#'
					delete params[key]
				}
				if(key.indexOf('notaryNumber')>=0){
					notaryNumber +=params[key] + '#'
					delete params[key]
				}
				if(key.indexOf('applyName')>=0){
					applyName +=params[key]+ '#'
					delete params[key]
				}
				if(key.indexOf('idcard')>=0){
					idcard +=params[key]+ '#'
					delete params[key]
				}
			}
			params.notarialMatters = notarialMatters
			params.notaryNumber = notaryNumber
			params.applyName = applyName
			params.idcard = idcard
			const current = this.state.current + 1;
			// this.setState({ current, value: params, threePage: params });
		})
	}
	next1() {
		const { infoData } = this.props
		if (!infoData) {
			if (this.state.documentType == "") {
				message.info('请选择档案类型')
				return
			}
		}

		const current = this.state.current + 1;
		this.setState({ current });
	}
	complete() {
		const { imgList, fileList1, fileList2, fileList3, fileList4, fileList5 } = this.state
		let pageNumber = new Number()
		imgList.map((item, i) => {
			var urlss = '';
			pageNumber += item.length
			item.map((item1, j) => {
				urlss += item1.urls + "#"
			})
			datas[i] = datas[i] + "@" + item.length + "@" + urlss
		})
		const params1 = this.state.value
		const { onCreate, onChage, onCreate1, infoData, onUpdate } = this.props
		billValue = '';
		datas.map((item, i) => {
			billValue += item + ","
		})
		//		params1.basicInfo = JSON.stringify(ValueData)
		params1.bill = billValue
		if (this.state.documentType != "") {
			params1.documentType = this.state.documentType
		} else {
			params1.documentType = infoData.document.documentType
		}

		if (!params1.remarks) {
			delete params1.remarks
		}
		if (this.state.value.notarizationAt == '') {
			params1.notarizationAt = moment(infoData.document.notarizationAt).format("YYYY-MM-DD HH:mm:ss")
		}
		if (this.state.value.createdTime == '') {
			params1.createdTime = moment(infoData.document.createdTime).format("YYYY-MM-DD HH:mm:ss")
		}
		params1.pageNumber = pageNumber
		if (location.search.split("?").length > 1) {
			params1.id = location.search.split("?")[1]
			onUpdate(params1)
		} else {
			onCreate1(params1)
		}

	}
	complete1() {
		const { onCreateApply, onUpdateApply, infoData } = this.props
		const { imgList, fileList1, fileList2, fileList3, fileList4, fileList5 } = this.state
		let pageNumber = new Number()
		imgList.map((item, i) => {
			var urlss = '';
			pageNumber += item.length
			item.map((item1, j) => {
				urlss += item1.urls + "#"
			})
			datas[i] = datas[i] + "@" + item.length + "@" + urlss
		})
		// console.log(pageNumber)
		const params1 = this.state.value
		billValue = '';
		// console.log(datas)
		datas.map((item, i) => {
			billValue += item + ","
		})
		//		params1.basicInfo = JSON.stringify(ValueData)
		params1.bill = billValue

		if (this.state.documentType != "") {
			params1.documentType = this.state.documentType
		} else {
			params1.documentType = infoData.document.documentType
		}
		if (this.state.value.notarizationAt == '') {
			params1.notarizationAt = moment(infoData.document.notarizationAt).format("YYYY-MM-DD HH:mm:ss")
		}
		if (this.state.value.createdTime == '') {
			params1.createdTime = moment(infoData.document.createdTime).format("YYYY-MM-DD HH:mm:ss")
		}
		if (!params1.remarks) {
			delete params1.remarks
		}
		params1.pageNumber = pageNumber
		if (location.search.split("?").length > 1) {
			params1.id = location.search.split("?")[1]
			onUpdateApply(params1)
		} else {
			onCreateApply(params1)
		}

	}
	prev() {
		const current = this.state.current - 1;
		this.setState({ current });
	}
	bottonClick(i) {
		if (document.getElementById(i).style.display != "block") {
			document.getElementById(i).style.display = 'block'
		} else {
			document.getElementById(i).style.display = 'none'
		}

		if (this.state.bottons == '查看') {
			this.setState({ bottons: "隐藏" })
		} else {
			this.setState({ bottons: "查看" })
		}
	}
	handleChange1(value) {
		const { onDep } = this.props
		onDep(value)
	}
	onSelect1(value, option) {
		//		console.log(value)
		//		console.log(option)
	}
	handleChange2(value) {
		const { onMenulist } = this.props
		onMenulist(value)
	}
	handClick(value) {
		const { onDep } = this.props
		onDep(value)
	}

	onTimeChange(name, type, ins, date, dateString) {
		ValueData.push({ "name": name, "type": type, "in": ins, "value": dateString })
		for (var i = 0; i < ValueData.length; i++) {
			for (var j = i + 1; j < ValueData.length; j++) {
				if (ValueData[i].name == ValueData[j].name) {
					ValueData.splice(i, 1)
				}
			}
		}
	}
	inpBlur(key, name, type, ins, e) {
		const { value } = e.target
		ValueData.push({ "name": name, "type": type, "in": ins, "value": value })
		for (var i = 0; i < ValueData.length; i++) {
			for (var j = i + 1; j < ValueData.length; j++) {
				if (ValueData[i].name == ValueData[j].name) {
					ValueData.splice(i, 1)
				}
			}
		}
	}
	convertBase64UrlToBlob(urlData) {

		var bytes = window.atob(urlData.split(',')[1]);        //去掉url的头，并转换为byte  

		// var bytes=window.atob(urlData);

		//处理异常,将ascii码小于0的转换为大于0  
		var ab = new ArrayBuffer(bytes.length);
		var ia = new Uint8Array(ab);
		for (var i = 0; i < bytes.length; i++) {
			ia[i] = bytes.charCodeAt(i);
		}
		return new Blob([ab], { type: 'image/png' });

	}

	dataURLtoFile(dataurl, filename) {//将base64转换为文件
		var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
			bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
		while (n--) {
			u8arr[n] = bstr.charCodeAt(n);
		}
		return new File([u8arr], filename, { type: mime });
	}

	b64toBlob(b64Data, contentType, sliceSize) {
		contentType = contentType || '';
		sliceSize = sliceSize || 512;

		var byteCharacters = atob(b64Data);
		var byteArrays = [];

		for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
			var slice = byteCharacters.slice(offset, offset + sliceSize);

			var byteNumbers = new Array(slice.length);
			for (var i = 0; i < slice.length; i++) {
				byteNumbers[i] = slice.charCodeAt(i);
			}

			var byteArray = new Uint8Array(byteNumbers);

			byteArrays.push(byteArray);
		}

		var blob = new Blob(byteArrays, { type: contentType });
		return blob;
	}
	urltoFile(url, filename, mimeType) {
		mimeType = mimeType || (url.match(/^data:([^;]+);/) || '')[1];
		return (fetch(url)
			.then(function (res) { return res.arrayBuffer(); })
			.then(function (buf) { return new File([buf], filename, { type: mimeType }); })
		);
	}
	handleScanUpload = () => {
		const { imgList } = this.state
		this.setState({ showLoading: true })
		// var scanbase = sessionStorage.getItem("sacnbase64")
		const _this = this
		//data:image/png;base64,

		// var scanbases = JSON.parse(scanbase)
		sacnbase123.map((item, i) => {
			let datas = new FormData();
			// let datas = new FormData();
			// var blob = this.b64toBlob(files, "jpg");
			// datas.append('file',blob) 
			// console.log(blob)
			// datas.append('file',this.convertBase64UrlToBlob(item))
			// datas.append('data', "data:image/png;base64," + item)
			// datas.append('data', files)
			// console.log(this.convertsBase64UrlToBlob(files))
			// datas.append('file',this.convertBase64UrlToBlob(files))
			// datas.append('file',this.dataURLtoFile(files,"file"))
			// console.log(this.dataURLtoFile(files))
			// console.log(this.dataURLtoFile(files,"file"))
			// console.log(datas)
			// console.log(datas.append('file',this.convertBase64UrlToBlob(files)))
			// $.ajaxSetup({contentType: 'application/x-www-form-urlencoded'});
			// const img1 = "data:image/png;base64,"+files
			this.urltoFile("data:image/png;base64," + item, 'a.JPG')
				.then(function (file) {
					datas.append("file", file);
					$.ajax({
						// headers: {'Content-Type': 'application/x-www-form-urlencoded'},
						url: 'http://file.sip.feelbang.com/upload?token=' + sessionStorage.getItem("token") + "&" + "sys=1001",
						type: 'POST',
						// dataType:"text",
						// cache: false,
						// headers: {
						// 	"Content-type": "multipart/form-data"
						// },
						//			data:new FormData($('#uploadForm')[0]),
						data: datas,
						// scriptCharset:"utf-8",
						processData: false,
						contentType: false
					}).done(function (res) {
						const names = JSON.parse(res)
						const name = "http://file.sip.feelbang.com/files/" + names.path + "?token=" + sessionStorage.getItem("token") + "&" + "sys=1001"
						if (imgList.length == 0) {
							imgList[clickOne] = []
						}
						imgList[clickOne].push({ uid: imgList[clickOne].length, status: 'done', url: name, urls: names.path })
						_this.setState({ test: false, showLoading: false })
						delete sacnbase123[i]
						// sessionStorage.removeItem("sacnbase64")
					}).fail(function (res) {
						console.log(res)
						_this.setState({ showLoading: false })
						delete sacnbase123[i]
						// sessionStorage.removeItem("sacnbase64")
					});
				})
		})
	}
	handleUpload = () => {
		const { imgList, fileList1, fileList2, fileList3, fileList4, fileList5 } = this.state
		this.setState({ showLoading: true })
		const _this = this
		var base = sessionStorage.getItem("base64")
		let datas = new FormData();
		// datas.append('data', base)
		this.urltoFile(base, 'a.JPG')
			.then(function (file) {
				datas.append("data", file);
				$.ajax({
					url: 'http://file.sip.feelbang.com/upload?token=' + sessionStorage.getItem("token") + "&" + "sys=1001",
					type: 'POST',
					cache: false,
					//		    headers: {
					//				"Content-type": "multipart/form-data"
					//			},
					//			data:new FormData($('#uploadForm')[0]),
					data: datas,
					processData: false,
					contentType: false
				}).done(function (res) {
					const names = JSON.parse(res)
					const name = "http://file.sip.feelbang.com/files/" + names.path + "?token=" + sessionStorage.getItem("token") + "&" + "sys=1001"
					if (imgList.length == 0) {
						imgList[clickOne] = []
					}
					imgList[clickOne].push({ uid: imgList[clickOne].length, status: 'done', url: name, urls: names.path })
					_this.setState({ test: false, showLoading: false })
				}).fail(function (res) {
					console.log(res)
					_this.setState({ showLoading: false })
				});
			})
	}
	bottomsClick(i) {
		clickOne = i
		this.setState({ showImg: true, showScanImg: false })
		//		var node = document.getElementById("photos")
		//		node.style.display = "block";
	}
	bottonScanClick(i) {
		clickOne = i
		this.setState({ showScanImg: true, showImg: false })
	}
	//	onChange1 = (info) => {
	//		let { fileList } = info;
	//		if (fileList[fileList.length - 1].response) {
	//			const paths = fileList[fileList.length - 1].response.path
	//			const name = "http://file.sip.feelbang.com/files/" + fileList[fileList.length - 1].response.path + "?token=" + sessionStorage.getItem("token")
	//			fileList.splice(fileList.length - 1, 1, { uid: fileList.length, status: 'done', url: name, urls: paths })
	//		}
	//		this.setState({ fileList1: fileList })
	//	}	
	onChanges = (i, info) => {
		const { imgList } = this.state
		let { fileList } = info;
		if (fileList.length > 0 && fileList[fileList.length - 1].response) {
			const paths = fileList[fileList.length - 1].response.path
			const name = "http://file.sip.feelbang.com/files/" + fileList[fileList.length - 1].response.path + "?token=" + sessionStorage.getItem("token") + "&" + "sys=1001"
			fileList.splice(fileList.length - 1, 1, { uid: fileList.length, status: 'done', url: name, urls: paths })
		}
		imgList[i] = fileList
		this.setState({ imgList })
	}

	imgClick = () => {
		// console.log("123")
		r += 90
		$("#imgs").css('transform', 'rotate(' + r + 'deg)');
	}

	handleCancel = () => this.setState({ previewVisible: false })

	handlePreview = (file) => {
		this.setState({
			previewImage: file.url || file.thumbUrl,
			previewVisible: true,
		});
	}
	handlePreview1 = (file) => {
		this.setState({
			previewImage: file.url,
			previewVisible: true,
		});
	}
	onUpdateChanges = (i, info) => {
		// console.log(info)
		const _this = this
		//删除给一个提示框
		if (info.file.status == "removed") {
			confirm({
				title: "提示",
				content: "是否删除",
				okText: "确认",
				cancelText: "取消",
				onOk: function () {
					//跳转到列表
					//   window.location = "/file/fileComponent";
					const { imgList } = _this.state
					let { fileList } = info;
					if (fileList.length > 0 && fileList[fileList.length - 1].response) {
						const paths = fileList[fileList.length - 1].response.path
						const name = "http://file.sip.feelbang.com/files/" + fileList[fileList.length - 1].response.path + "?token=" + sessionStorage.getItem("token") + "&" + "sys=1001"
						fileList.splice(fileList.length - 1, 1, { uid: fileList.length, status: 'done', url: name, urls: paths })
					}
					imgList[i] = fileList
					_this.setState({ imgList, fileList, isChange: true })
				},
				onCancel: function () {
					//   location.reload()
					return
				}
			});
		} else {
			const { imgList } = _this.state
			let { fileList } = info;
			if (fileList.length > 0 && fileList[fileList.length - 1].response) {
				const paths = fileList[fileList.length - 1].response.path
				const name = "http://file.sip.feelbang.com/files/" + fileList[fileList.length - 1].response.path + "?token=" + sessionStorage.getItem("token") + "&" + "sys=1001"
				fileList.splice(fileList.length - 1, 1, { uid: fileList.length, status: 'done', url: name, urls: paths })
			}
			imgList[i] = fileList
			_this.setState({ imgList, fileList, isChange: true })
		}

	}
	handleOpenDev = () => {
		openDev()
	}
	handleCaptureBase64 = () => {
		CaptureBase64()
	}
	handleOpenScan = () => {
		getdslist()
	}
	handleScanBase64 = () => {
		scan()
		const { showImgList } = this.state
		const baseImgs = JSON.parse(sessionStorage.getItem("sacnbase64"))
		if (baseImgs) {
			baseImgs.map((item, i) => {
				showImgList.push(<img style={{ width: 80, margin: 5 }} src={"data:image/jpg;base64," + item} />)
			})
		}
	}
	createTimeChange = (data, dateString) => {
		this.setState({ createdTime: dateString })
	}
	notarizationChange = (data, dateString) => {
		this.setState({ notarizationAt: dateString })
	}
	selectChange = (value) => {
		this.setState({ documentType: value })
	}
	matterChange = (value) => {
		// console.log(value)
		this.setState({ saveYear: value })
	}


	removeForm = (k) => {
		const { form } = this.props;

		const { keys } = this.state
		delete keys[k]
		this.setState({
			keys:keys
		})
	}
	addForm = () => {
		const { form } = this.props;

		const {keys} = this.state

		keys[new Date().getTime()] = {}

		this.setState({key:keys})
	}

	removePersonForm = (k) => {
		const { form } = this.props;
		
		const { keys1 } = this.state
		delete keys1[k]
		this.setState({
			keys1:keys1
		})
	}
	addPersonForm = () => {
		const { form } = this.props;

		const {keys1} = this.state

		keys1[new Date().getTime()] = {}

		this.setState({key1:keys1})
	}

	handleSubmitForm = (e) => {
		e.preventDefault();
		this.props.form.validateFields((err, values) => {
			if (!err) {
				console.log('Received values of form: ', values);
			}
		});
	}
	componentDidMount = () => {
		const { infoData } = this.props
		let keys = {}
		if(infoData){
			
		}
		this.setState({keys:keys})
	}
	componentDidUpdate = () => {
		const { infoData } = this.props
		let notarialMatters = [];
		let notaryNumber = [];
		let applyName = [];
		let idcard = [];
		let keys={}

		if(infoData){
			notarialMatters = infoData.document.idcard.split("#")
			notaryNumber = infoData.document.notaryNumber.split("#")
			applyName = infoData.document.applyName.split("#")
			idcard = infoData.document.idcard.split("#")

			// notarialMatters = notarialMatters.splice(notarialMatters.length-1,1)
			notaryNumber = notaryNumber.splice(notaryNumber.length-1,1)
			applyName = applyName.splice(applyName.length-1,1)
			idcard = idcard.splice(idcard.length-1,1)
		}
		// console.log(notarialMatters)
		if(notarialMatters.length > 0){
			notarialMatters.map((item,i)=>{
				keys[String(i+1)] = {
					notarialMatters:notarialMatters[i],
					notaryNumber:notaryNumber[i],
					applyName:applyName[i],
					idcard:idcard[i],
				}
			})
			// console.log(keys)
			// this.setState({keys:keys})
		}
		
	}
	render() {
		const _this = this
		const { imgList, fileList1, fileList2, fileList3, fileList4, fileList5 } = this.state
		var propss = []

		const { department1, department2, onDep, depTypes, onMenulist, infoList, infoData, userList, matter, contractor, archiving } = this.props
		const { getFieldDecorator, getFieldsValue, getFieldValue } = this.props.form
		const { previewVisible, previewImage } = this.state;
		// console.log(contractor)
		// console.log(infoData)
		const formItemLayout = {
			labelCol: { span: 6 },
			wrapperCol: { span: 18 },
		};
		const formItemLayout1 = {
			labelCol: { span: 3 },
			wrapperCol: { span: 21 },
		};
		const formItemLayout2 = {
			labelCol: { span: 6 },
			wrapperCol: { span: 16 },
		};
		const formItemLayoutWithOutLabel = {
			wrapperCol: {
				xs: { span: 24, offset: 0 },
				sm: { span: 16, offset: 8 },
			},
		};

		// getFieldDecorator('keys', { initialValue: [] });
		// const keys = getFieldValue('keys');

		const {keys,keys1}=this.state

		var myArry = []
		var peopleArry = []
		for(let key in keys){
			myArry.push(
				{
					'key':key,
					'notarialMatters':keys[key].notarialMatters,
					'notaryNumber':keys[key].notaryNumber,
					// 'applyName':keys[key].applyName,
					// 'idcard':keys[key].idcard
				}
			)
		}

		for(let key in keys1){
			peopleArry.push(
				{
					'key':key,
					// 'notarialMatters':keys[key].notarialMatters,
					// 'notaryNumber':keys[key].notaryNumber,
					'applyName':keys1[key].applyName,
					'idcard':keys1[key].idcard
				}
			)
		}

		const formItems = myArry.map((item, index) => {
			// console.log(item.key)
			// console.log(index)
			return (
				<div className={styles.addDiv}>
					<Form key={item.key}>
					<Row gutter={24} span={24}>
						<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 8 }}>
							<FormItem
								label="公证事项："
								{...formItemLayout}>
								{getFieldDecorator(`notarialMatters${item.key}`, {
									// initialValue: infoData ? this.state.value.notarialMatters ? this.state.value.notarialMatters : infoData.document.notarialMatters : this.state.value.notarialMatters,
									initialValue: item.notarialMatters,
									rules: [{ required: true, message: '公证事项不能为空' }],
								})(
									<Input placeholder="请输入公证事项" />
								)}
							</FormItem>
						</Col>
						<Col lg={12} md={6} sm={8} xs={12}>
							<FormItem
								label="公证号："
								{...formItemLayout}>
								{getFieldDecorator(`notaryNumber${item.key}`, {
									// initialValue: infoData ? this.state.value.notaryNumber ? this.state.value.notaryNumber : infoData.document.notaryNumber : this.state.value.notaryNumber,
									initialValue: item.notaryNumber,
									rules: [{ required: true, message: '公证号不能为空' }],
								})(
									<Input placeholder="请填写公证号" />
								)}
							</FormItem>
						</Col>
					</Row>
					{myArry.length > 1 ? (
						<div className={styles.addIcon}>
							<Icon
								style={{ fontSize: 20 }}
								className="dynamic-delete-button"
								type="minus-circle-o"
								disabled={keys.length === 1}
								onClick={() => this.removeForm(item.key)}
							/>
						</div>
					) : null}
					</Form>
				</div>

			);
		});

		const formItems1 = peopleArry.map((item, index) => {
			return (
				<div className={styles.addDiv}>
					<Form key={item.key}>
					<Row gutter={24} style={{ marginBottom: 8 }}>
						<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 8 }}>
							<FormItem
								label="申请人："
								{...formItemLayout}>
								{getFieldDecorator(`applyName${item.key}`, {
									// initialValue: infoData ? this.state.value.applyName ? this.state.value.applyName : infoData.document.applyName : this.state.value.applyName,
									initialValue: item.applyName,
									rules: [{ required: true, message: '申请人不能为空' }],
								})(
									<Input placeholder="请填写申请人" />
								)}
							</FormItem>
						</Col>
						<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 8 }}>
							<FormItem
								label="身份证："
								{...formItemLayout}>
								{getFieldDecorator(`idcard${item.key}`, {
									// initialValue: infoData ? this.state.value.idcard ? this.state.value.idcard : infoData.document.idcard : this.state.value.idcard,
									initialValue: item.idcard,
									rules: [{ required: true, message: '身份证不能为空' }],
								})(
									<Input placeholder="请填写身份证" />
								)}
							</FormItem>
						</Col>
					</Row>
					{peopleArry.length > 1 ? (
						<div className={styles.addIcon}>
							<Icon
								style={{ fontSize: 20 }}
								className="dynamic-delete-button"
								type="minus-circle-o"
								disabled={keys1.length === 1}
								onClick={() => this.removePersonForm(item.key)}
							/>
						</div>
					) : null}
					</Form>
				</div>

			);
		});
		// <FormItem
		// 	{...(index === 0 ? formItemLayout : formItemLayoutWithOutLabel)}
		// 	label={index === 0 ? 'Passengers' : ''}
		// 	required={false}
		// 	key={k}
		// >
		// 	{getFieldDecorator(`names[${k}]`, {
		// 		validateTrigger: ['onChange', 'onBlur'],
		// 		rules: [{
		// 			required: true,
		// 			whitespace: true,
		// 			message: "Please input passenger's name or delete this field.",
		// 		}],
		// 	})(
		// 		<Input placeholder="passenger name" style={{ width: '60%', marginRight: 8 }} />
		// 	)}
		// {keys.length > 1 ? (
		// 	<Icon
		// 		className="dynamic-delete-button"
		// 		type="minus-circle-o"
		// 		disabled={keys.length === 1}
		// 		onClick={() => this.remove(k)}
		// 	/>
		// ) : null}
		// </FormItem>





		const uploadButton = (
			<div>
				<Icon type="plus" />
				<div className="ant-upload-text">上传</div>
			</div>
		);
		const { current } = this.state;
		const matterList = [];
		for (let i = 0; i < matter.length; i++) {
			matterList.push(<Option key={matter[i].name} value={matter[i].term}>{matter[i].name}</Option>)
		}
		const contractorList = [];
		for (let i = 0; i < contractor.length; i++) {
			contractorList.push(<Option key={contractor[i].userId} value={contractor[i].userId}>{contractor[i].username}</Option>);
		}
		const archivingList = [];
		for (let i = 0; i < archiving.length; i++) {
			archivingList.push(<Option key={archiving[i].userId} value={archiving[i].userId}>{archiving[i].username}</Option>);
		}
		const userLists = [];
		for (let i = 0; i < userList.length; i++) {
			userLists.push(<Option key={userList[i].userId} value={userList[i].userId}>{userList[i].username}</Option>);
		}
		const groupChild = [];
		for (let i = 0; i < department1.length; i++) {
			groupChild.push(<Option key={department1[i].id} value={department1[i].id}>{department1[i].name}</Option>);
		}
		const depChild = [];
		for (let i = 0; i < department2.length; i++) {
			depChild.push(<Option key={department2[i].id} value={department2[i].id}>{department2[i].name}</Option>);
		}
		const typeChild = [];
		for (let i = 0; i < depTypes.length; i++) {
			typeChild.push(<Option key={depTypes[i].id}>{depTypes[i].name}</Option>);
		}
		var menuPage = [];
		var photoPage = [];
		var completePhoto = [];
		var photoList = [];
		//修改
		if (infoData != '') {
			var pages = infoData.document.documentBillList
			for (let i = 0; i < pages.length; i++) {
				datas[i] = pages[i].name + "@" + pages[i].collectType
				const bottoms = [];
				if (imgList.length < pages.length) {
					imgList[i] = []
				}
				if (imgList[i].length == 0 && this.state.isChange == false) {
					for (var j = 0; j < pages[i].billfileList.length; j++) {
						// console.log(pages[i].billfileList.length)
						imgList[i][j] = { uid: j, status: 'done', url: baseUrl + pages[i].billfileList[j].url + "?token=" + sessionStorage.getItem("token") + "&" + "sys=1001", urls: pages[i].billfileList[j].url }
					}
				}
				propss[i] = {
					action: 'http://file.sip.feelbang.com/upload?token=' + sessionStorage.getItem("token") + "&" + "sys=1001",
					listType: 'picture-card',
					//解决preflight response
					fileList: imgList[i],
					headers: {
						"X-Requested-With": null
					},

					//	defaultFileList: [...fileList2],
					className: 'upload-list-inline',
					onPreview: this.handlePreview,
					onChange: this.onUpdateChanges.bind(this, i),
				};

				if (pages[i].collectType != undefined) {
					const bot = pages[i].collectType.split("#")
					// console.log(bot)
					bot.map((item, j) => {
						if (item == "拍照") {
							bottoms.push(
								<Button
									key={j}
									style={{ marginLeft: 10 }}
									onClick={this.bottomsClick.bind(this, i)}
									type="primary"
									size='default'>
									{item}
								</Button>
							)
						} else if (item == "本地") {
							bottoms.push(
								<Button
									style={{ marginLeft: 10 }}
									onClick={this.bottonClick.bind(this, i)}
									type="primary"
									size='default'>
									{item}
								</Button>
							)
						} else if (item == "扫描") {
							bottoms.push(
								<Button
									style={{ marginLeft: 10 }}
									onClick={this.bottonScanClick.bind(this, i)}
									type="primary"
									size='default'>
									{item}
								</Button>
							)
						}
						else {
							bottoms.push(
								<Button
									style={{ marginLeft: 10 }}
									type="primary"
									size='default'>
									{item}
								</Button>
							)
						}
					})
				}
				const uploads = "";

				photoPage.push(
					<div>
						<div style={{ display: "flex", justifyContent: "space-between", margin: "10px 20px", background: "#f4f4f4", lineHeight: "50px", borderRadius: 5 }}>
							<span style={{ marginLeft: 10, fontWeight: 600 }}>{i + 1}.{pages[i].name} [{imgList[i] ? imgList[i].length : "0"}条]</span>
							<div style={{ marginRight: 10 }}>
								<Button type="primary"
									onClick={this.bottonClick.bind(this, i)}
									style={{ border: "1px solid #DDDDDD", marginRight: 10, color: "black", backgroundImage: "linear-gradient(180deg,#fdfdfd 0%,#dddddd 98%)" }}>
									查看
								</Button>
								{bottoms}
							</div>
						</div>
						<div id={i} style={{ overflow: "scroll", height: "200px", margin: "0 40px", display: "none" }}>
							<div className="clearfix">
								<Upload
									{...propss[i]}
								>
									{uploadButton}
								</Upload>

							</div>

						</div>
					</div>
				)
				completePhoto.push(
					<div>
						<div style={{ display: "flex", justifyContent: "space-between", margin: "10px 20px", background: "#f4f4f4", lineHeight: "50px", borderRadius: 5 }}>
							<span style={{ marginLeft: 10, fontWeight: 600 }}>{i + 1}.{pages[i].name} [{imgList[i] ? imgList[i].length : "0"}条]</span>
							<div style={{ marginRight: 10 }}>
								<Button type="primary"
									onClick={this.bottonClick.bind(this, i)}
									style={{ border: "1px solid #DDDDDD", marginRight: 10, color: "black", backgroundImage: "linear-gradient(180deg,#fdfdfd 0%,#dddddd 98%)" }}>
									查看
								</Button>
							</div>
						</div>
						<div id={i} style={{ overflow: "scroll", height: "200px", margin: "0 40px", display: "none" }}>
							<div className="clearfix">

								{imgList[i] && imgList.length > 0
									?
									imgList[i].map((item, i) => (
										<img onClick={this.handlePreview1.bind(null, item)} src={item.url} style={{ width: 80, margin: 5, cursor: "pointer" }} />
									))
									: null}

							</div>

						</div>
					</div>
				)
			}

		}
		//新增
		if (infoList != '') {
			var pages = JSON.parse(infoList.billInfo)
			for (let i = 0; i < pages.length; i++) {
				propss[i] = {
					action: 'http://file.sip.feelbang.com/upload?token=' + sessionStorage.getItem("token") + "&" + "sys=1001",
					listType: 'picture-card',
					//解决preflight response
					fileList: imgList[i],
					headers: {
						"X-Requested-With": null
					},

					//	defaultFileList: [...fileList2],
					className: 'upload-list-inline',
					onChange: this.onChanges.bind(this, i),
				};
				datas[i] = pages[i].name + "@" + pages[i].type
				const bottoms = [];
				if (pages[i].type != undefined) {
					const bot = pages[i].type.split("#")
					// console.log(bot)
					bot.map((item, j) => {
						if (item == "拍照") {
							bottoms.push(
								<Button
									key={j}
									style={{ marginLeft: 10 }}
									onClick={this.bottomsClick.bind(this, i)}
									type="primary"
									size='default'>
									{item}
								</Button>
							)
						} else if (item == "本地") {
							bottoms.push(
								<Button
									style={{ marginLeft: 10 }}
									onClick={this.bottonClick.bind(this, i)}
									type="primary"
									size='default'>
									{item}
								</Button>
							)
						} else if (item == "扫描") {
							bottoms.push(
								<Button
									style={{ marginLeft: 10 }}
									onClick={this.bottonScanClick.bind(this, i)}
									type="primary"
									size='default'>
									{item}
								</Button>
							)
						}
						else {
							bottoms.push(
								<Button
									style={{ marginLeft: 10 }}
									type="primary"
									size='default'>
									{item}
								</Button>
							)
						}


					})
				}
				const uploads = "";
				photoPage.push(
					<div>
						<div style={{ display: "flex", justifyContent: "space-between", margin: "10px 20px", background: "#f4f4f4", lineHeight: "50px", borderRadius: 5 }}>
							<span style={{ marginLeft: 10, fontWeight: 600 }}>{i + 1}.{pages[i].name} [{imgList[i] ? imgList[i].length : "0"}条]</span>
							<div style={{ marginRight: 10 }}>
								<Button type="primary"
									onClick={this.bottonClick.bind(this, i)}
									style={{ border: "1px solid #DDDDDD", marginRight: 10, color: "black", backgroundImage: "linear-gradient(180deg,#fdfdfd 0%,#dddddd 98%)" }}>
									查看
								</Button>
								{bottoms}
							</div>
						</div>
						<div id={i} style={{ overflow: "scroll", height: "200px", margin: "0 40px", display: "none" }}>
							<div className="clearfix">
								<Upload
									{...propss[i]}
								>
									{uploadButton}
								</Upload>

							</div>

						</div>
					</div>
				)

				completePhoto.push(
					<div>
						<div style={{ display: "flex", justifyContent: "space-between", margin: "10px 20px", background: "#f4f4f4", lineHeight: "50px", borderRadius: 5 }}>
							<span style={{ marginLeft: 10, fontWeight: 600 }}>{i + 1}.{pages[i].name} [{imgList[i] ? imgList[i].length : 0}条]</span>
							<div style={{ marginRight: 10 }}>
								<Button type="primary"
									onClick={this.bottonClick.bind(this, i)}
									style={{ border: "1px solid #DDDDDD", marginRight: 10, color: "black", backgroundImage: "linear-gradient(180deg,#fdfdfd 0%,#dddddd 98%)" }}>
									查看
								</Button>

							</div>
						</div>
						<div id={i} style={{ overflow: "scroll", height: "200px", margin: "0 40px", display: "none" }}>
							<div className="clearfix">

								{imgList[i] && imgList.length > 0
									?
									imgList[i].map((item, i) => (
										<img onClick={this.handlePreview1.bind(null, item)} src={item.url} style={{ width: 80, margin: 5, cursor: "pointer" }} />
									))
									: null}
							</div>

						</div>
					</div>
				)
			}
		}

		//		第三步展示的数据
		const threePage = []
		//		if (ValueData.length > 0) {
		if (steps[this.state.current].content == "last") {
			imgList.map((item, i) => {
				threePageNumber += item.length
			})
		}

		if (this.state.threePage) {
			threePage.push(<li style={{ width: "33.3%", lineHeight: "40px" }}>档案年度:{this.state.threePage.documentYear}</li>)
			threePage.push(<li style={{ width: "33.3%", lineHeight: "40px" }}>批次号:{this.state.threePage.batchNumber}</li>)
			threePage.push(<li style={{ width: "33.3%", lineHeight: "40px" }}>公证事项:{this.state.threePage.notarialMatters}</li>)
			threePage.push(<li style={{ width: "33.3%", lineHeight: "40px" }}>申请人:{this.state.threePage.applyName}</li>)
			threePage.push(<li style={{ width: "33.3%", lineHeight: "40px" }}>身份证:{this.state.threePage.idcard}</li>)
			threePage.push(<li style={{ width: "33.3%", lineHeight: "40px" }}>建档日期:{this.state.threePage.createdTime ? this.state.threePage.createdTime : moment(infoData.document.createdTime).format("YYYY-MM-DD HH:mm:ss")}</li>)
			threePage.push(<li style={{ width: "33.3%", lineHeight: "40px" }}>公证日期:{this.state.threePage.notarizationAt ? this.state.threePage.notarizationAt : moment(infoData.document.notarizationAt).format("YYYY-MM-DD HH:mm:ss")}</li>)
			threePage.push(<li style={{ width: "33.3%", lineHeight: "40px" }}>保管日期:{this.state.threePage.storageLife}</li>)
			threePage.push(<li style={{ width: "33.3%", lineHeight: "40px" }}>档案页数:{threePageNumber}</li>)
			threePage.push(<li style={{ width: "33.3%", lineHeight: "40px" }}>公证号:{this.state.threePage.notaryNumber}</li>)
		}
		if (this.state.current > 1) {
			threePage.push(<li style={{ width: "33.3%", lineHeight: "40px" }}>档案类型:{this.state.documentType ? this.state.documentType : infoData.document.documentType}</li>)
		}

		if (contractor.length > 0) {
			for (var i = 0; i < contractor.length; i++) {
				if (this.state.threePage.contractorUserId == contractor[i].userId) {
					threePage.push(
						<li style={{ width: "33.3%", lineHeight: "40px" }}>承办人:{contractor[i].username}</li>
					)
				}
			}
		}
		if (archiving.length > 0) {
			for (var i = 0; i < archiving.length; i++) {
				if (this.state.threePage.createdUserId == archiving[i].userId) {
					threePage.push(
						<li style={{ width: "33.3%", lineHeight: "40px" }}>建档人:{archiving[i].username}</li>
					)
				}
			}
		}
		// if (department1.length > 0) {
		// 	for (var i = 0; i < department1.length; i++) {
		// 		if (this.state.threePage.organizationId == department1[i].id) {
		// 			threePage.push(
		// 				<li style={{ width: "33.3%", lineHeight: "40px" }}>组织机构:{department1[i].name}</li>
		// 			)
		// 		}
		// 	}
		// }
		// if (department2.length > 0) {
		// 	for (var i = 0; i < department2.length; i++) {
		// 		if (this.state.threePage.departmentId == department2[i].id) {
		// 			threePage.push(
		// 				<li style={{ width: "33.3%", lineHeight: "40px" }}>部门类别:{department2[i].name}</li>
		// 			)
		// 		}
		// 	}
		// }
		// if (this.state.threePage) {
		// 	threePage.push(
		// 		<li style={{ width: "33.3%", lineHeight: "40px" }}>档案编号:{this.state.threePage.number}</li>
		// 	)
		// 	threePage.push(
		// 		<li style={{ width: "33.3%", lineHeight: "40px" }}>档案名称:{this.state.threePage.title}</li>
		// 	)
		// 	threePage.push(
		// 		<li style={{ width: "33.3%", lineHeight: "40px" }}>档案类型:{this.state.threePage.archivesType}</li>
		// 	)
		// 	threePage.push(
		// 		<li style={{ width: "33.3%", lineHeight: "40px" }}>业务类型:{this.state.threePage.businessType}</li>
		// 	)
		// 	threePage.push(
		// 		<li style={{ width: "33.3%", lineHeight: "40px" }}>介质类型:{this.state.threePage.mediumType == 0 ? '电子档案' : '纸质档案'}</li>
		// 	)
		// 	threePage.push(
		// 		<li style={{ width: "33.3%", lineHeight: "40px" }}>卷宗类型:{this.state.threePage.type}</li>
		// 	)
		// }

		//		}

		return (
			<Form className={styles.modalSelect} style={{ backgroundColor: "#ffffff" }}>
				<Steps current={current} style={{ width: "60%", marginLeft: "20%", paddingTop: 20, marginBottom: 50 }}>
					{steps.map(item => <Step key={item.title} title={item.title} />)}
				</Steps>

				{steps[this.state.current].content == "first" ?
					//第一步       
					<div className="steps-content" style={{ width: "60%", marginLeft: "20%", marginTop: 20 }}>
						<Row gutter={24} span={24}>
							<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 8 }}>
								<FormItem
									label="档案年度："
									{...formItemLayout}>
									{getFieldDecorator('documentYear', {
										initialValue: infoData ? this.state.value.documentYear ? this.state.value.documentYear : infoData.document.documentYear : '2018',
										rules: [{ required: true, message: '档案年度不能为空' }],
									})(
										<Select
											style={{ width: '100%' }}
											placeholder="请档案年度"
										// onChange={this.handleChange1.bind(this)}
										//											onSelect={this.onSelect1.bind(this)}
										>
											{/* <Option key={department1[i].id} value={department1[i].id}>{department1[i].name}</Option> */}
											<Option key="2018" value="2018">2018</Option>
											<Option key="2017" value="2017">2017</Option>
											<Option key="2016" value="2016">2016</Option>
											<Option key="2015" value="2015">2015</Option>
											<Option key="2014" value="2014">2014</Option>
											<Option key="2013" value="2013">2013</Option>
											<Option key="2012" value="2012">2012</Option>
											<Option key="2011" value="2011">2011</Option>
											<Option key="2010" value="2010">2010</Option>
											<Option key="2009" value="2009">2009</Option>
											<Option key="2008" value="2008">2008</Option>
											<Option key="2007" value="2007">2007</Option>
											<Option key="2006" value="2006">2006</Option>
											<Option key="2005" value="2005">2005</Option>
											<Option key="2004" value="2004">2004</Option>
											<Option key="2003" value="2003">2003</Option>
											<Option key="2002" value="2002">2002</Option>
											<Option key="2001" value="2001">2001</Option>
											<Option key="2000" value="2000">2000</Option>
										</Select>
									)}
								</FormItem>
							</Col>
							<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 8 }}>
								<FormItem
									label="批次号："
									{...formItemLayout}>
									{getFieldDecorator('batchNumber', {
										initialValue: infoData ? this.state.value.batchNumber ? this.state.value.batchNumber : infoData.document.batchNumber : this.state.value.batchNumber,
										rules: [{ required: true, message: '批次号不能为空' }],
									})(
										<Input placeholder="请输入批次号" />
									)}
								</FormItem>
							</Col>
						</Row>
						{formItems}
						<FormItem {...formItemLayoutWithOutLabel}>
							<Button type="dashed" onClick={this.addForm} style={{ width: '60%' }}>
								<Icon type="plus" /> 新增公证信息
								</Button>
						</FormItem>

						{formItems1}
						<FormItem {...formItemLayoutWithOutLabel}>
							<Button type="dashed" onClick={this.addPersonForm} style={{ width: '60%' }}>
								<Icon type="plus" /> 新增申请人
								</Button>
						</FormItem>
						{/* <Row gutter={24} span={24}>
							<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 8 }}>
								<FormItem
									label="公证事项："
									{...formItemLayout}>
									{getFieldDecorator('notarialMatters', {
										initialValue: infoData ? this.state.value.notarialMatters ? this.state.value.notarialMatters : infoData.document.notarialMatters : this.state.value.notarialMatters,
										rules: [{ required: true, message: '公证事项不能为空' }],
									})(
										<Input placeholder="请输入公证事项" />
									)}
								</FormItem>
							</Col>
							<Col lg={12} md={6} sm={8} xs={12}>
									<FormItem
										label="公证号："
										{...formItemLayout}>
										{getFieldDecorator('notaryNumber', {
											initialValue: infoData ? this.state.value.notaryNumber ? this.state.value.notaryNumber : infoData.document.notaryNumber : this.state.value.notaryNumber,
											rules: [{ required: true, message: '公证号不能为空' }],
										})(
											<Input placeholder="请填写公证号" />
										)}
									</FormItem>
								</Col>
						</Row>
						<Row gutter={24} style={{ marginBottom: 8 }}>
							<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 8 }}>
								<FormItem
									label="申请人："
									{...formItemLayout}>
									{getFieldDecorator('applyName', {
										initialValue: infoData ? this.state.value.applyName ? this.state.value.applyName : infoData.document.applyName : this.state.value.applyName,
										rules: [{ required: true, message: '申请人不能为空' }],
									})(
										<Input placeholder="请填写申请人" />
									)}
								</FormItem>
							</Col>
							<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 8 }}>
								<FormItem
									label="身份证："
									{...formItemLayout}>
									{getFieldDecorator('idcard', {
										initialValue: infoData ? this.state.value.idcard ? this.state.value.idcard : infoData.document.idcard : this.state.value.idcard,
										rules: [{ required: true, message: '身份证不能为空' }],
									})(
										<Input placeholder="请填写身份证" />
									)}
								</FormItem>
							</Col>
						</Row> */}

						<Row gutter={24} span={24}>
							<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 8 }}>
								<FormItem
									label="收件日期："
									{...formItemLayout}>
									{getFieldDecorator('createdTime', {
										initialValue: infoData ? this.state.value.createdTime ? moment(this.state.value.createdTime, dateFormat) : moment(infoData.document.createdTime) : this.state.value.createdTime ? moment(this.state.value.createdTime, dateFormat) : "",
										rules: [{ required: true, message: '收件日期不能为空' }],
									})(
										<DatePicker
											style={{ width: "100%" }}
											placeholder="收件日期"
											showTime
											format="YYYY-MM-DD HH:00:00"
											onChange={this.createTimeChange}
										/>
									)}
								</FormItem>
							</Col>
							<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 8 }}>
								<FormItem
									label="公证日期："
									{...formItemLayout}>
									{getFieldDecorator('notarizationAt', {
										initialValue: infoData ? this.state.value.notarizationAt ? moment(this.state.value.notarizationAt, dateFormat) : moment(infoData.document.notarizationAt) : this.state.value.notarizationAt ? moment(this.state.value.notarizationAt, dateFormat) : "",
										rules: [{ required: true, message: '公证日期不能为空' }],
									})(
										<DatePicker
											style={{ width: "100%" }}
											placeholder="公证日期"
											showTime
											format="YYYY-MM-DD HH:00:00"
											onChange={this.notarizationChange}
										/>
									)}
								</FormItem>
							</Col>
						</Row>

						<Row gutter={24} style={{ marginBottom: 8 }}>
							<FormItem
								label="档案备注："
								{...formItemLayout1}>
								{getFieldDecorator('remarks', {
									initialValue: infoData ? this.state.value.remarks ? this.state.value.remarks : infoData.document.remarks ? infoData.document.remarks : "" : this.state.value.remarks,
									// rules: [{ required: true, message: '申请人不能为空' }],
								})(
									<TextArea rows={4} />
								)}
							</FormItem>
						</Row>

						<div style={{ borderBottom: "1px dashed #d9d9d9", marginBottom: 32 }}></div>

						<div>
							<Row gutter={24} span={24} style={{ marginTop: 16 }}>
								<Col lg={12} md={6} sm={8} xs={12}>
									<FormItem
										label="保管期限："
										{...formItemLayout}>
										{getFieldDecorator('storageLife', {
											// initialValue: infoData && this.state.saveYear == "" ? infoData.document.storageLife : this.state.value.storageLife ? this.state.value.storageLife:this.state.saveYear,
											initialValue: infoData ? this.state.value.storageLife ? this.state.value.storageLife : infoData.document.storageLife : this.state.value.storageLife,
											rules: [{ required: true, message: '保管期限不能为空' }],
										})(
											<Select
												// disabled={infoData ? true : false}
												style={{ width: '100%' }}
												placeholder="请选择保管期限"
											>
												<Option key="短期">短期</Option>
												<Option key="长期">长期</Option>
												<Option key="永久">永久</Option>
											</Select>
											// <Input disabled={infoData ? true : false} placeholder="请选择公证事项" />
										)}
									</FormItem>
								</Col>
								{/* <Col lg={12} md={6} sm={8} xs={12}>
									<FormItem
										label="档案页数："
										{...formItemLayout}>
										{getFieldDecorator('pageNumber', {
											initialValue: infoData ? this.state.value.pageNumber?this.state.value.pageNumber:infoData.document.pageNumber : this.state.value.pageNumber,
											rules: [{ required: true, message: '档案页数不能为空' }],
										})(
											<Input placeholder="请填写档案页数" />
										)}
									</FormItem>
								</Col> */}
							</Row>

							{/* <Row gutter={24} style={{ marginBottom: 8 }}>
								<FormItem
									label="公证号："
									{...formItemLayout1}>
									{getFieldDecorator('notaryNumber', {
										initialValue: infoData ? this.state.value.notaryNumber?this.state.value.notaryNumber:infoData.document.notaryNumber : this.state.value.notaryNumber,
										rules: [{ required: true, message: '公证号不能为空' }],
									})(
										<Input placeholder="请填写公证号" />
									)}
								</FormItem>
							</Row> */}

							<Row gutter={24} span={24}>
								<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 8 }}>
									<FormItem
										label="承办人："
										{...formItemLayout}>
										{getFieldDecorator('contractorUserId', {
											initialValue: infoData ? this.state.value.contractorUserId ? this.state.value.contractorUserId : infoData.document.contractorUserId : this.state.value.contractorUserId,
											rules: [{ required: true, message: '承办人不能为空' }],
										})(
											<Select
												style={{ width: '100%' }}
												placeholder="请选择承办人"
											// onChange={this.handleChange1.bind(this)}
											//											onSelect={this.onSelect1.bind(this)}
											>
												{/* <Option key={department1[i].id} value={department1[i].id}>{department1[i].name}</Option> */}
												{/* {userLists} */}
												{contractorList}
											</Select>
										)}
									</FormItem>
								</Col>
								<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 8 }}>
									<FormItem
										label="建档人："
										{...formItemLayout}>
										{getFieldDecorator('createdUserId', {
											initialValue: infoData ? this.state.value.createdUserId ? this.state.value.createdUserId : infoData.document.createdUserId : this.state.value.createdUserId,
											rules: [{ required: true, message: '建档人不能为空' }],
										})(
											<Select
												style={{ width: '100%' }}
												placeholder="请选择建档人"
											// onChange={this.handleChange}
											>
												{/* <Option key={department2[i].id} value={department2[i].id}>{department2[i].name}</Option> */}
												{/* {userLists} */}
												{archivingList}
											</Select>
										)}
									</FormItem>
								</Col>
							</Row>

							<Row gutter={24} span={24}>
								<Col lg={12} md={6} sm={8} xs={12} style={{ marginBottom: 16 }}>
									<FormItem
										label="卷宗类型："
										{...formItemLayout}>
										{getFieldDecorator('dossierType', {
											initialValue: infoData ? infoData.document.dossierType : this.state.value.dossierType,
											rules: [{ required: true, message: '卷宗类型不能为空' }],
										})(
											<Select
												disabled={infoData ? true : false}
												style={{ width: '100%' }}
												placeholder="请选择卷宗类型"
												onChange={this.handleChange2.bind(this)}
											>
												{typeChild}
											</Select>
										)}
									</FormItem>
								</Col>
							</Row>
						</div>

					</div>
					:
					steps[this.state.current].content == "second" ?
						//第二步	        		
						<div style={{ display: "flex", marginBottom: 20 }}>
							<div style={{ position: "absolute", width: "100%", lineHeight: "600px", textAlign: "center", zIndex: 99999999, display: this.state.showLoading ? "block" : "none" }}><Icon style={{ fontSize: 160, color: "#1790ff" }} type="loading" /></div>
							<div className="contentLeft" style={{ width: "60%", height: 600, borderRadius: 10, border: "1px dashed #d9d9d9", overflow: 'scroll' }}>
								{/* <div style={{ marginLeft: 20, marginTop: 10, margin: 20, display: "flex" }}>
									<span style={{ fontSize: 18 }}>扫描选择:</span>
									<Select style={{ marginLeft: 10, width: 160 }}>
										<Option key={1}>单面ADF扫描</Option>
										<Option key={2}>双面ADF扫描</Option>
									</Select>
									<Button
										style={{ marginLeft: 10 }}
										type="primary"
										size='default'>重置设备</Button>
								</div> */}
								<div style={{ marginLeft: 20, marginTop: 10, margin: 20 }}>
									<span style={{ fontSize: 18 }}>档案类型:</span>
									<Select style={{ marginLeft: 10, width: 160 }} defaultValue={infoData ? infoData.document.documentType : this.state.documentType} onChange={this.selectChange}>
										<Option key="国内">国内</Option>
										<Option key="涉外">涉外</Option>
										<Option key="公证">公证</Option>
										<Option key="提存">提存</Option>
										<Option key="回收卷">回收卷</Option>
									</Select>
								</div>
								<div className="listLib">
									<span style={{ fontSize: 18, margin: 20 }}>资料清单:</span>
									{photoPage}
								</div>
							</div>

							<div className="contentRight" style={{ width: "40%", height: 600, borderRadius: 10, border: "1px dashed #d9d9d9", marginLeft: 20, display: "flex", justifyContent: "space-around", alignItems: "center", flexDirection: "column" }}>
								{this.state.showImg == false && this.state.showScanImg == false ?
									<div style={{ display: "flex", justifyContent: "center", alignItems: "center", flexDirection: "column", marginTop: 70 }}>
										<img src={require('../../../assets/photo.png')} style={{ width: 120, margin: 5 }} />
										<span>实时预览</span>
									</div>
									:
									this.state.showImg == true ?
										<div style={{ width: "80%", display: "flex", flexDirection: "column", justifyContent: "center", alignItems: "center" }}>
											<img id="myCanvas" style={{ height: 240, width: 320, marginBottom: 20, backgroundColor: "black", float: "left" }} />
											<div>
												<Button onClick={() => this.handleCaptureBase64()}>拍照Base64</Button>
												<Button onClick={this.handleOpenDev} style={{ marginLeft: 10 }}>开启摄像头</Button>
											</div>
										</div> :
										<div>
											{/* <div style={{ overflow: "scroll" }}>
												{this.state.showImgList}
											</div> */}
											<div style={{ textAlign: "center", marginBottom: 20 }}>
												<Button onClick={() => this.handleOpenScan()}>启动扫描仪</Button>
												<Button onClick={this.handleScanBase64} style={{ marginLeft: 10 }}>扫描</Button>
											</div>
										</div>
								}
								<div style={{ textAlign: "center" }}>
									{this.state.showImg == false && this.state.showScanImg == false ?
										<div></div>
										:
										this.state.showImg == true ?
											<Button type="primary" style={{ marginBottom: 10 }} onClick={this.handleUpload}>
												拍照上传
	        							</Button> :
											<Button type="primary" style={{ marginBottom: 10 }} onClick={this.handleScanUpload}>
												扫描上传
	        							</Button>
									}
								</div>





							</div>
						</div>
						:
						//第三步
						<div style={{ width: "60%", marginLeft: "20%" }}>
							<div style={{ textAlign: 'center' }}>
								<img src={require('../../../assets/complete.png')} style={{ width: 80, margin: 5 }} />
								<h5 style={{ fontSize: 24, textAlign: "center", fontWeight: 600 }}>档案目录已生成 请确认后提交</h5>
							</div>
							{/*
								<span style={{ fontSize: 20, marginLeft: 20 }}>录入条形码:</span>
								<div style={{textAlign:"center",marginLeft: 20,padding:10,border:" 1px dashed",borderRadius:10}}>
									<img src={require('../../../assets/barCode.png')} />
								</div>
							*/}


							<div>
								<span style={{ fontSize: 20, marginLeft: 20 }}>文档信息:</span>
								<br />
								<ul style={{ display: "flex", flexWrap: "wrap", margin: "0 10px" }}>
									{threePage}
								</ul>
							</div>


							<div className="listLib">
								<span style={{ fontSize: 20, marginLeft: 20 }}>资料清单:</span>
								{completePhoto}
							</div>
						</div>

				}
				<div className="steps-action" style={{ textAlign: 'center', paddingBottom: 10 }}>
					{
						this.state.current > 0
						&&
						<Button className={styles.button} style={{ marginLeft: 8 }} onClick={() => this.prev()}>
							上一步
	            </Button>
					}
					{
						this.state.current === 0 && this.state.current < steps.length - 1
						&&
						<Button className={styles.button} type="primary" onClick={() => this.next()}>下一步</Button>
					}
					{
						this.state.current > 0 && this.state.current < steps.length - 1
						&&
						<Button className={styles.button} type="primary" style={{ marginLeft: 10 }} onClick={() => this.next1()}>下一步</Button>
					}
					{
						this.state.current === steps.length - 1
						&&
						<Button className={styles.button} type="primary" style={{ marginLeft: 10 }} onClick={() => this.complete()}>
							提交
						</Button>
					}
					{
						this.state.current === steps.length - 1

						&&

						<Button className={styles.button} style={{ background: "#4BBF62", marginLeft: 10, color: "white" }} onClick={() => this.complete1()}>
							提交并申请归档
						</Button>
					}


				</div>
				{/* 图片预览的展示 */}
				<Modal visible={previewVisible} footer={null} onCancel={this.handleCancel}>
					<img id="imgs" alt="example" style={{ width: 400, height: 400 }} src={previewImage} />
					<Button style={{ position: "absolute", right: 30, top: 200 }} type="primary" shape="circle" icon="reload" onClick={this.imgClick} />
				</Modal>
			</Form>
		)
	}


}

export default Form.create()(ModalSelect)
